
<!-- ElementPlus暗黑模式 -->


<script>

import { useDark, useToggle } from '@vueuse/core'
import { Sunny, Moon } from '@element-plus/icons-vue'

export default {
    name: 'ElementDark',
    data() {
        return {
            isDark: useDark(),
            IconEpSunny: Sunny,
            IconEpMoon: Moon
        }
    },
    methods: {
        toggleDark() {
            useToggle(isDark)
        }
    }
}
</script>


<template>
    <el-switch v-model="isDark" inline-prompt :active-icon="IconEpSunny" :inactive-icon="IconEpMoon"
        active-color="var(--el-fill-color-dark)" inactive-color="var(--el-color-primary)" @change="toggleDark" />
</template>

<style scoped></style>